{"id":466,"date":"2018-03-08T14:29:50","date_gmt":"2018-03-08T06:29:50","guid":{"rendered":"http:\/\/jqnets.com\/blog\/?p=466"},"modified":"2019-09-18T09:28:18","modified_gmt":"2019-09-18T01:28:18","slug":"vue-js-%e8%a7%a3%e6%b1%baaxios%e8%b7%a8%e5%9f%9f%e5%95%8f%e9%a1%8c","status":"publish","type":"post","link":"https:\/\/jqnets.com\/blog\/vue-js-%e8%a7%a3%e6%b1%baaxios%e8%b7%a8%e5%9f%9f%e5%95%8f%e9%a1%8c\/","title":{"rendered":"Vue.js – \u89e3\u6c7aaxios\u8de8\u57df\u554f\u984c"},"content":{"rendered":"

\n\t\u5728Vue\u7684\u958b\u767c\u5c08\u6848\u88cf\uff0c\n<\/p>\n

\n\t\u6709\u6642\u9700\u8981\u900f\u904e\u50cfAjax\u4f86\u53d6\u5f97\u9060\u7aef\u8cc7\u6599\uff0c\n<\/p>\n

\n\t\u800c\u5728Vue.js\u88cf\u4f7f\u7528\u7684\u662f axios<\/a> \u7684\u65b9\u5f0f\u4f86\u8de8\u57df\u53d6\u8b80\u9060\u7aefPHP\u7684\u8cc7\u6599\uff0c\n<\/p>\n

\n\t\u4f46\u554f\u984c\u4f86\u4e86\uff0c\n<\/p>\n

\n\t\u5728\u672c\u6a5f\u4f7f\u7528 localhost \u7684\u65b9\u5f0f\u6703\u51fa\u73fe\u4e0b\u9762\u8de8\u7db2\u57df\u5b58\u53d6\u7684\u8b66\u544a\u3002\n<\/p>\n

\n\t\n<\/p>\n

\n\t \n<\/p>\n

\n\t\u89e3\u6c7a\u6b65\u9a5f\u5982\u4e0b:\n<\/p>\n

\n\t1. Vue\u7a0b\u5f0f\u4e2d\u52a0\u5165 axios \u8a2d\u5b9a\u503c<\/strong>
\n<\/h2>\n
\r\n      axios.get(\r\n        url,\r\n         {\r\n            headers: {'X-Requested-With': 'XMLHttpRequest'},<\/span> \/\/ \u82e5\u6709\u9001\u51faheader\u9700\u6c42, PHP\u8981\u8a2d\u5b9a\u76f8\u5c0d\u7684header\u53c3\u6578 \r\n            withCredentials: true,<\/span> \/\/ default: false \u82e5\u6709\u4f7f\u7528cookie\u3001session\u5247\u8981\u958b\u555f, \u5426\u5247\u700f\u89bd\u5668\u4e0d\u6703\u5c07response\u8fd4\u56de \r\n            responseType: 'json', \r\n            timeout: 60*1000, \r\n            params:{\r\n                'act':'getData'  \r\n            }\r\n         }\r\n      ).then(response => {\r\n          \/\/ success callback\r\n      }, response => {\r\n          \/\/ error callback\r\n      });<\/span><\/pre>\n
\n\t \n<\/p>\n
\n\t2. PHP\u7a0b\u5f0f\u4e2d\u52a0\u5165 header \u8a2d\u5b9a\u503c<\/strong>
\n<\/h2>\n
\r\n<?php<\/span>\r\nheader("Content-Type:text\/html; charset=utf-8");<\/span>\r\nheader('Content-type: application\/json');<\/span>\r\n\/\/ axios \u89e3\u6c7a\u8de8\u57df\u554f\u984c<\/span>\r\nheader("Access-Control-Allow-Credentials: true");<\/span>  \/\/ \u76f8\u5c0d\u61c9 axios \u7684\u8a2d\u5b9a\uff0c\u82e5\u6709\u4f7f\u7528cookie\u3001session\u5247\u8981\u958b\u555f, \u5426\u5247\u700f\u89bd\u5668\u4e0d\u6703\u5c07response\u8fd4\u56de  <\/span>\r\nheader("Access-Control-Allow-Origin: http:\/\/localhost:8080"); <\/span> \/\/ \u6307\u5b9a\u53ef\u5141\u8a31\u8a2a\u554f\u7684URL  <\/span>\r\nheader("Access-Control-Allow-Methods: POST, GET, OPTIONS");<\/span> \/\/ \u5141\u8a31\u5ba2\u6236\u7aef\u53ef\u4f7f\u7528\u7684\u65b9\u5f0f  <\/span>\r\nheader("Access-Control-Allow-Headers: X-PINGOTHER, Content-Type, X-Requested-With");<\/span> \/\/ \u670d\u52d9\u5668\u5141\u8a31\u8acb\u6c42\u4e2d\u651c\u5e36\u5b57\u6bb5 <\/span>\r\n?><\/span><\/pre>\n
\n\t \n<\/p>\n
\n\t\u4ee5\u4e0a\u5169\u500b\u6b65\u9a5f\u8a2d\u5b9a\u5b8c\u5f8c\uff0c\n<\/p>\n
\n\t\u5c31\u53ef\u4ee5\u9806\u5229\u7684\u8de8\u7db2\u57df\u53d6\u5f97\u8cc7\u6599\u4e86\u3002\n<\/p>\n
\n\t \n<\/p>\n
\n\t <\/p>\n","protected":false},"excerpt":{"rendered":"
\u5728Vue\u7684\u958b\u767c\u5c08\u6848\u88cf\uff0c \u6709\u6642\u9700\u8981\u900f\u904e\u50cfAjax\u4f86\u53d6\u5f97\u9060\u7aef\u8cc7\u6599\uff0c \u800c\u5728Vue.js\u88cf\u4f7f\u7528\u7684\u662f axios \u7684\u65b9\u5f0f\u4f86\u8de8\u57df\u53d6\u8b80\u9060\u7aefPHP\u7684\u8cc7\u6599\uff0c \u4f46\u554f\u984c\u4f86\u4e86\uff0c \u5728\u672c\u6a5f\u4f7f\u7528 localhost \u7684\u65b9\u5f0f\u6703\u51fa\u73fe\u4e0b\u9762\u8de8\u7db2\u57df\u5b58\u53d6\u7684\u8b66\u544a\u3002   \u89e3\u6c7a\u6b65\u9a5f\u5982\u4e0b: 1. Vue\u7a0b\u5f0f\u4e2d\u52a0\u5165 axios \u8a2d\u5b9a\u503c axios.get( url, { headers: {'X-Requested-With': 'XMLHttpRequest'}, \/\/ \u82e5\u6709\u9001\u51fahe […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"categories":[3,251],"tags":[147,146,142],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p6rhcT-7w","jetpack-related-posts":[],"jetpack_likes_enabled":false,"_links":{"self":[{"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/posts\/466"}],"collection":[{"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/comments?post=466"}],"version-history":[{"count":5,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/posts\/466\/revisions"}],"predecessor-version":[{"id":524,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/posts\/466\/revisions\/524"}],"wp:attachment":[{"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/media?parent=466"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/categories?post=466"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jqnets.com\/blog\/wp-json\/wp\/v2\/tags?post=466"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}