Cordova – Errors not load image

  • kiểm tra đường dẫn file
  • dùng style={{backgroundImg:’url()’}} thay vì set trong css
Advertisements

Server Render – Các vấn đề gặp phải

Mục đích SSR không chỉ để SEO tốt, mà quan trọng hơn là để share FB và các platform khác

  1. Load API trong component
    1. Có thể xử lý được bằng cách tạo một static function fetchData trong mỗi component cần gọi API
    2. hàm này sẽ gọi một action -> tự động update cho store khi hoàn thành
  2. Css loader
    1. Có thể xử lý bằng cách tạo biến __CLIENT__ & __SERVER__
    2. Check trên client để require css
  3. Các module không hỗ trợ SSR : ví dụ swiper -> ua=navigator.userAgent <- undefined trên server
    1. Xử lý tạm thời bằng cách ko dùng router, ko dùng renderHtml
    2. Chỉ match req.path với các action để gọi API tương ứng mà thôi

 

Hybrid app : load file local

Không thể dùng fetch để load local được, vì vậy phải build 1 function mới

function fetchLocal(url) {
  return new Promise(function(resolve, reject) {
    var xhr = new XMLHttpRequest
    xhr.onload = function() {
      resolve(new Response(xhr.responseText, {status: xhr.status}))
    }
    xhr.onerror = function() {
      reject(new TypeError('Local request failed'))
    }
    xhr.open('GET', url)
    xhr.send(null)
  })
}

Tham khảo
https://codepen.io/KryptoniteDove/post/load-json-file-locally-using-pure-javascript
https://jakearchibald.com/2015/thats-so-fetch/

Cách 2: Chưa thử

var path = window.location.href.replace(‘index.html’, );
$.getJSON(path + “fixtures/initial.json”, function(data)
{
    // do something with data
});
http://www.erol.si/2013/10/how-to-read-local-json-file-with-phonegap-jquery-mobile/

Cordova hot-code-push not working

The problem is resolved. Looking at forums, below are the correct steps

  1. Run cordova plugin add cordova-hot-code-push-plugin in the project
  2. Install npm install -g cordova-hot-code-push-cli on the system
  3. Run cordova-hcp init and enter details
  4. Run cordova-hcp build
  5. Add the following in config.xml

    <chcp> <config-file url="https://example.com/chcp.json"/> </chcp>

  6. Run cordova build

http://stackoverflow.com/questions/38159396/cordova-hot-code-push-not-working

Deploying a React App to Cordova

I’ve been building out a webapp using react. It’s completely responsive and developed in device mode.

Once I was happy with it’s behavior in browsers I decided it was time to port it as a native mobile app. Below we assume the whole application has been compiled with Browserify or Webpack into an app.js file. I’m also assuming es6 syntax and inline styles.

index.html

  • declare cordova.js before your bundle. This is automatically injected by Cordova at runtime.
  • declare a viewport meta tag to prevent resizing
  • declare a Content Security Policy. Read Cordova-plugin-whitelist.