js http请求怎么写

js 访问外网http请求怎么写（第一次接触不太清楚，请多多指教）

img

小魔女参考了bing和GPT部分内容调写:
访问外网http请求，可以使用JavaScript中的XMLHttpRequest对象。XMLHttpRequest对象可以帮助我们实现异步的HTTP请求，而不会阻塞当前页面的其他操作。

一般来说，使用XMLHttpRequest的步骤如下：

  1. 创建一个XMLHttpRequest对象；
  2. 打开一个连接；
  3. 向服务器发送请求；
  4. 监听readystatechange事件，并根据状态码判断是否请求成功；
  5. 获取服务器返回的数据。

下面是一个使用XMLHttpRequest实现外网http请求的例子：

let xhr = new XMLHttpRequest();  //创建一个XMLHttpRequest对象
xhr.open('GET', 'http://www.example.com/', true);  //打开一个连接，true表示异步请求
xhr.send(null);   //向服务器发送请求
xhr.onreadystatechange = function(){  //监听readystatechange事件
  if(xhr.readyState == 4 && xhr.status == 200){  //判断状态码是否为200，200表示请求成功
    let responseText = xhr.responseText;  //获取服务器返回的数据
    console.log(responseText);  //将数据打印在控制台上
  }
}

回答不易，记得采纳呀。

使用ajax向后端发送请求
格式:
$.ajax({
常用属性:
url : 请求的服务器端url地址
 async : (默认: true) 默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false,
 data : 发送到服务器的数据，可以是键值对形式，也可以是js对象形式
 type : (默认: "GET") 请求方式 ("POST" 或 "GET")， 默认为 "GET"
dataType:   预期的返回数据的类型，取值可以是 xml, html, script, json, text, _defaul等.
 success:function(result){
请求成功后的回调函数
result代表回调的值
},    
error:function(){
请求失败时调用此函数，服务器发生异常会触发这个函数运行
}  
注意：上面的属性是区分大小写的。
这个方法最强大的地方在于可以处理服务器异常时给出友好提示。
});

该回答引用ChatGPT

在 JavaScript 中，可以使用 XMLHttpRequest 对象或者 Fetch API 来发送 HTTP 请求，获取远程资源。

以下是使用 XMLHttpRequest 对象发送 POST 请求的示例代码：


const xhr = new XMLHttpRequest();
const url = "http://ip:端口/sms/smsapi/getTpllist";
const apikey = "26743791-298c-4d6e-80de-31af53382697";

xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");

xhr.onreadystatechange = function () {
  if (xhr.readyState === 4 && xhr.status === 200) {
    const response = xhr.responseText;
    console.log(response); // 处理获取到的响应数据
  }
};

const data = {
  apikey: apikey,
};

xhr.send(JSON.stringify(data));

使用 Fetch API 发送 POST 请求的示例代码：

const url = "http://ip:端口/sms/smsapi/getTpllist";
const apikey = "26743791-298c-4d6e-80de-31af53382697";

const options = {
  method: "POST",
  headers: {
    "Content-Type": "application/json;charset=UTF-8",
  },
  body: JSON.stringify({ apikey }),
};

fetch(url, options)
  .then((response) => response.text())
  .then((data) => console.log(data))
  .catch((error) => console.log(error));

需要注意的是，在 JavaScript 中访问外部资源存在跨域问题，如果你的网站和接口服务不在同一域名下，需要在服务端配置跨域访问。如果是访问 HTTPS 网站，还需要注意 SSL 证书的问题。


   //1.创建对象
            const xhr = new XMLHttpRequest();
            xhr.open('POST', 'http://ip:端口/sms/smsapi/getTpllist');

            //设置请求头
            xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
            xhr.send('apikey:26743791-298c-4d6e-80de-31af53382697');
            xhr.onreadystatechange = function() {
                if (xhr.readyState === 4) {
                    if (xhr.status >= 200 && xhr.status < 300) {
                        //服务端返回的结果
                        console.log(xhr.getAllResponseHeaders());
                    }
                }
            }

以上方法我都试过了，都保错net::ERR_CONNECTION_REFUSED

vue里可以使用axios 。具体使用 看 官网就行 不过通常就是 url，参数填进去就行 。通常还涉及 跨域问题 ，前端还得 设置 proxy.
https://cloud.tencent.com/developer/article/1098141