Basic Features of Nginx in front end (Windows)

When the project was packaged for testing before using the scenario, for example, write a project with Vue, package it and throw it to the background, they said it wouldn’t work… You can throw it to them and say I tested it myself and it works, you didn’t put it right and then write a simple test case demo, call the interface

Before configuring proxy configuration configuration, let’s do it again

Write a simple H5 page, want to adjust the interface, found cross-domain, static page certainly cross-domain ah

Next, how to solve the cross-domain, I request is the third party interface, write a test demo, that can only set the proxy, usually write project using VUE. You don’t need to write a vUE project to set up a proxy. It’s just HTML. Instead, set up a local server, nignx, and configure proxy forwarding

  • 1 download address, choose a stable version of it, also not commonly used nginx.org/en/download…
  • 2. Foolproof installation
  • 3. Open the nginx.conf file

There are a lot of things in the file, which I use to learn which, record what I use, other unused content (including comments) I delete

#user nobody; worker_processes 1; # error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/nginx.pid; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; sendfile on; #tcp_nopush on; #keepalive_timeout 0; keepalive_timeout 65; # enable gzip on; server { listen 88; Server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root D:/test/dist; // This is where you want to start nignx. } #error_page 404/404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root D:/test/dist/error.html; } # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # For example in the project use baidu third party location ^ ~ / baidu / {proxy_pass https://aip.baidubce.com/; // The connection must be followed by a backslash /}}}.Copy the code

Used in the project

// Get access_token. This request must be written to the URL using apiKey and Sk <https://ai.baidu.com/ai-doc/REFERENCE/Ck3dwjhhu> tests https://aip.baidubce.com/rest/2.0/face/v1/merge?access_token=24.f9ba9c5341b67688ab4added8bc91dec.2592000.1485570332.2823 35-8574074 axios({ method: 'post', url: '/ baidu/rest / 2.0 / face/v1 / merge? Access_token = 24) f9ba9c5341b67688ab4added8bc91dec. 2592000.1485570332.282335-8574074 "}) .then(function (response) { access_token = response.data.access_token expires_in = response.data.expires_in }) .catch(function (error) { console.log('error', error); });Copy the code

Request success, using his example, regardless of the returned content