const baseUrl = 'http://10.92.1.17:6601/videoapi/';
//const baseUrl = '/videoapi/';
//对于 GET 方法,会将数据转换为 query string。例如 { name: 'name', age: 18 } 转换后的结果是 name=name&age=18。
//对于 POST 方法且 header['content-type'] 为 application/json 的数据,会进行 JSON 序列化。
//对于 POST 方法且 header['content-type'] 为 application/x-www-form-urlencoded 的数据,会将数据转换为 query string。
//postJson请求数据存放在requestBody中
const HttpPostJson = (url, data) => {
	//登录后将用户的token存放在缓存中
	let token = "";
	uni.getStorage({
		key: 'token',
		success: function(ress) {
			token = ress.data,
				data.token = ress.data
		}
	});
	let opts = {
		url: baseUrl + url,
		data: data,
		method: 'POST',
		header: {
			"Content-Type": "application/json; charset=UTF-8",
			"token": token
		},
		dataType: 'json'
	}
	let promise = new Promise(function(resolve, reject) {
		uni.request(opts).then(
			(res) => {
				resolve(res[1].data)
			}
		).catch(
			(response) => {
				reject(response)
			}
		)
	})
	return promise
};

//get请求
const HttpGet = (url, data) => {
	////登录后将用户的token存放在缓存中
	let token = "";
	uni.getStorage({
		key: 'token',
		success: function(ress) {
			token = ress.data,
				data.token = ress.data
		}
	});
	let opts = {
		url: baseUrl + url,
		data: data,
		method: 'GET',
		header: {
			"token": token
		},
		dataType: 'json'
	}
	let promise = new Promise(function(resolve, reject) {
		uni.request(opts).then(
			(res) => {
				resolve(res[1])
			}
		).catch(
			(response) => {
				reject(response)
			}
		)
	})
	return promise
};

//表单提交
const HttpPostForm = (url, data) => {
	//登录后将用户的token存放在缓存中
	let token = "";
	uni.getStorage({
		key: 'token',
		success: function(ress) {
			token = ress.data,
				data.token = ress.data
		}
	});
	let opts = {
		url: baseUrl + url,
		data: data,
		method: 'POST',
		header: {
			"Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
			"token": token
		},
		dataType: 'json'
	}
	let promise = new Promise(function(resolve, reject) {
		uni.request(opts).then(
			(res) => {
				resolve(res[1])
			}
		).catch(
			(response) => {
				reject(response)
			}
		)
	})
	return promise
};

//文件上传(单文件上传)
/**
 * fileType:文件类型,image/video/audio仅支付宝小程序,且必填。
 * fileName:文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
 * filePath:要上传文件资源的路径
 * formData:HTTP 请求中其他额外的 form data
 * files : 需要上传的文件列表。使用 files 时,filePath 和 name 不生效。
 */
const HttpPostFile = (url, formData, fileName, fileType, filePath) => {
	//登录后将用户的token存放在缓存中
	let token = "";
	uni.getStorage({
		key: 'token',
		success: function(ress) {
			token = ress.data,
				data.token = ress.data
		}
	});
	let opts = {
		url: baseUrl + url,
		formData: formData,
		filePath: filePath,
		fileType: fileType,
		name: fileName,
		method: 'POST',
		header: {
			"Content-Type": "multipart/form-data",
			"token": token
		},
		dataType: 'json'
	}
	let promise = new Promise(function(resolve, reject) {
		uni.uploadFile(opts).then(
			(res) => {
				resolve(res[1])
			}
		).catch(
			(response) => {
				reject(response)
			}
		)
	})
	return promise
};

/**
 * 文件下载GET请求
 */
const HttpDownloadFile = (url) => {
	//登录后将用户的token存放在缓存中
	let token = "";
	uni.getStorage({
		key: 'token',
		success: function(ress) {
			token = ress.data,
				data.token = ress.data
		}
	});
	let opts = {
		url: baseUrl + url,
		method: 'GET',
		header: {
			"token": token
		},
		dataType: 'json'
	}
	let promise = new Promise(function(resolve, reject) {
		uni.uploadFile(opts).then(
			(res) => {
				resolve(res[1])
			}
		).catch(
			(response) => {
				reject(response)
			}
		)
	})
	return promise
};

export default {
	baseUrl,
	HttpPostForm,
	HttpGet,
	HttpPostJson,
	HttpPostFile,
	HttpDownloadFile
}

  

<template>
	<view class="content">

	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
		onLoad() {
			let object = {};
			this.http.HttpPostJson('login/findImageCode', object).then(res => {
				console.log(res);
				//打印请求返回的数据
			}, error => {
				console.log(error);
			})
		},
		methods: {

		}
	}
</script>

<style>
	@import url("index.css");
</style>

  

import Vue from 'vue'
import App from './App'
import http from './common/http.js'

Vue.config.productionTip = false
//当前时间
Vue.prototype.now = Date.now || function() {
	return new Date().getTime();
};
//请求接口
Vue.prototype.http = http;
//获取缓存中用户的token
Vue.prototype.token = uni.getStorageSync("token");
//获取用户信息
Vue.prototype.userInfo = uni.getStorageSync("userInfo");

App.mpType = 'app'

const app = new Vue({
	...App
})
app.$mount()

  解决跨域问题

    "h5" : {
        "devServer" : {
            "inline":false,
            "port" : 8080,
            "host" : "0.0.0.0",
            "disableHostCheck" : true,
            "proxy" : {
                "/videoapi" : {
                    "target" : "http://10.92.1.17:6601/",
                    "changeOrigin" : true,
                    "secure" : false,
                    "pathRewrite":{"^/dpc":""}
                }
            }
        },
        "router" : {
            "mode" : "history"
        },
        "optimization" : {
            "treeShaking" : {
                "enable" : true
            }
        }
    }

uniapp 初始化项目的更多相关文章

  1. 使用node初始化项目

    初始化项目 在建项目的时候经常会建很多文件夹和文件,今天使用node初始化项目自动生成这些内容. 执行步骤 执行命令 node init 初始化项目生成package.json 设置配置文件 var ...

  2. vue初始化项目,构建vuex的后台管理项目架子

    构架vuex的后台管理项目源码:https://github.com/saucxs/structure-admin-web 一.node安装 可以参考这篇文章http://www.mwcxs.top/ ...

  3. Git帮助之初始化项目设置向导

    初始化项目设置向导 Git设置: git config --global user.name "Your Name Here" # 设置Git提交时的默认用户名,推荐使用本站用户名 ...

  4. 一步步建立 Vue + Cesium 初始化项目

    一步步建立 Vue + Cesium 初始化项目 初始化 Vue 项目 升级 npm npm install -g npm 安装 @vue/cli 和 @vue/cli-service-global ...

  5. react native初始化项目

    打开命令行窗口,进入我们想要创建项目的父目录,输入命令: npm install -g yarn react-native-cli react-native init 项目名 进入新建的项目目录,执行 ...

  6. git初始化项目 以及 git常用操作

    初始化项目 $ git config --global user.name "Your Name"  配置用户名 $ git config --global user.email ...

  7. Git 初始化项目、创建合并分支、回滚等常用方法总结

    就在刚才查看资料时候, 看见一句话, 写的特别好: 当我的才华撑不起我的梦想的时候, 应该安静下来学习 配上我最喜欢动漫的一个角色: 红莲 1. Git 初始化项目 1). 创建新的知识库 echo ...

  8. 初探angluar_01 目录结构分析及初始化项目

    简单说明:angular是模块化的,因此所有功能功能都属于组件 一.目录结构 e2e 端到端的测试目录  用来做自动测试的 node_modules 安装地依赖存放目录,package.json里安装 ...

  9. React Native 0.56.1初始化项目运行出现错误(Module `AccessibilityInfo` does not exist in the Haste module map)

    当使用react-native init myApp初始化项目时,出现以下错误 出现以上错误的原因是因为0.56.1版本初始化项目就有问题,请见 https://github.com/facebook ...

随机推荐

  1. Java 布尔运算

    章节 Java 基础 Java 简介 Java 环境搭建 Java 基本语法 Java 注释 Java 变量 Java 数据类型 Java 字符串 Java 类型转换 Java 运算符 Java 字符 ...

  2. win下的常用8个命令

    windows下常用的几个指令 一,ping 它是用来检查网络是否通畅或者网络连接速度的命令.作为一个生活在网络上的管理员或者黑客来说,ping命令是第一个必须掌握的DOS命令,它所利用的原理是这样的 ...

  3. HihoCoder第十一周:树中的最长路

    #1050 : 树中的最长路 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 上回说到,小Ho得到了一棵二叉树玩具,这个玩具是由小球和木棍连接起来的,而在拆拼它的过程中, ...

  4. vim快速跳转到某一行

    在vim命令行模式下输入 : n(行数)  |

  5. No 'Access-Control-Allow-Origin' header is present on the requested resource——Web Api跨域问题

    最近使用C#写了一个简单的web api项目,在使用项目中的.cshtml文档测试的时候没有任何问题,但是在外部HBuilder上面编写.html通过Ajax调用web api路径时报错: No 'A ...

  6. 九十二、SAP中ALV事件之六,复制一个标准工具栏到自己的程序

    一.我们来到SE41,点击复制状态按钮 二.点击复制状态后,弹出一个框框,上面是模板内容,下面是我们自己的程序 三.我们根据上一篇的标准模板内容,填好相应的模板和我们的程序的内容 三.点击复制按钮 五 ...

  7. 149-PHP大小写转换函数

    <?php $str='PHP is a very good programming language.'; //定义一个字符串 echo "未经处理的字符串:<br /> ...

  8. 每天一点点之vue框架开发 - 如何在一个页面调用另一个同级页面的方法

    使用场景: 页面分为header.home.footer三部分,需要在home中调用header中的方法,这两个没有相互引入 官方给出方法: api传送门 在项目中实现: 1.首先同一个vue实例来调 ...

  9. c++ auto_ptr笔记

    1.auto_ptr 不可以使用指针惯用的赋值初始化方式,只能直接初始化. 示例:  char *p = 'A';//error  auto_ptr<char>ptr = new char ...

  10. c++ 字符串转数字或数字转字符串

    在C++中字符串转换为数字,或数字转换为字符串,用到如下函数: _itoa atoi.atof.itoa.itow _itoa_s 1.整形转换为字符串: wchar_t * _itot(int _V ...