当前位置: 首页 > news >正文

使用html 和javascript 实现微信界面功能2

1.功能说明:

对上一篇的基础上进行了稍稍改造
主要修改点:
搜索功能:
在搜索框后面增加了搜索按钮。
搜索按钮调用performSearch函数来执行搜索操作。
表单形式的功能:
上传文件: 修改为表单形式,允许用户通过文件输入控件选择文件并上传。
发布朋友圈: 修改为表单形式,允许用户输入朋友圈内容并发布。
展示视频: 修改为表单形式,允许用户输入视频URL并展示。

2.代码展示

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>简易版微信</title><style>body {font-family: Arial, sans-serif;display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background-color: #f5f5f5;}.container {width: 80%;max-width: 1200px;background: white;border-radius: 10px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);overflow: hidden;display: flex;}.sidebar {width: 25%;background: #e9ecef;padding: 20px;box-sizing: border-box;}.main-content {width: 75%;padding: 20px;box-sizing: border-box;}.search-area {margin-bottom: 20px;display: flex;align-items: center;}.search-area input {width: calc(100% - 80px);padding: 10px;border: 1px solid #ddd;border-radius: 5px;outline: none;}.search-area button {padding: 10px 20px;border: none;background: #07c160;color: white;cursor: pointer;border-radius: 5px;margin-left: 10px;}.search-area button:hover {background: #06a352;}.friends-list, .favorites-list, .files-list, .moments-list, .videos-list {margin-top: 20px;}.item {padding: 10px;border-bottom: 1px solid #ddd;cursor: pointer;}.item:last-child {border-bottom: none;}.item:hover {background: #f1f1f1;}.video-item video {width: 100%;border-radius: 10px;}.disabled {opacity: 0.5;pointer-events: none;}.messages {max-height: 300px;overflow-y: auto;border-bottom: 1px solid #ddd;padding-bottom: 10px;}.message {margin-bottom: 10px;}.message.user {text-align: right;}.message.bot {text-align: left;}.input-area {display: flex;border-top: 1px solid #ddd;}.input-area input {flex-grow: 1;padding: 10px;border: none;outline: none;}.input-area button {padding: 10px;border: none;background: #07c160;color: white;cursor: pointer;}.input-area button:hover {background: #06a352;}.confirmation-message {margin-top: 20px;padding: 10px;background: #ffcccc;border: 1px solid #ff4d4d;border-radius: 5px;}.confirmation-message p {margin: 0;}.confirmation-buttons button {margin-right: 10px;}.friend-details img {width: 50px;height: 50px;border-radius: 50%;object-fit: cover;margin-right: 10px;}.form-group {margin-bottom: 15px;}.form-group label {display: block;margin-bottom: 5px;}.form-group input,.form-group textarea,.form-group select {width: 100%;padding: 10px;border: 1px solid #ddd;border-radius: 5px;outline: none;}.form-group button {padding: 10px 20px;border: none;background: #07c160;color: white;cursor: pointer;border-radius: 5px;}.form-group button:hover {background: #06a352;}.preview-image {width: 100px;height: 100px;border-radius: 50%;object-fit: cover;margin-top: 10px;}</style>
</head>
<body><div class="container"><div class="sidebar"><h3>搜索</h3><div class="search-area"><input type="text" id="searchInput" placeholder="搜索..."><button onclick="performSearch()">搜索</button></div><h3>好友</h3><div class="friends-list" id="friendsList"><div class="item" onclick="showFriends()">查看好友</div></div><h3>收藏</h3><div class="favorites-list" id="favoritesList"><div class="item" onclick="showFavorites()">查看收藏</div></div><h3>文件</h3><div class="files-list" id="filesList"><div class="item" onclick="showFiles()">查看文件</div></div><h3>朋友圈</h3><div class="moments-list" id="momentsList"><div class="item" onclick="showMoments()">查看朋友圈</div></div><h3>视频号</h3><div class="videos-list" id="videosList"><div class="item" onclick="showVideos()">查看视频</div></div></div><div class="main-content"><h2 id="contentTitle">主界面</h2><div id="contentArea"></div></div></div><script>let friends = [];let favorites = [];let files = [];let moments = [];let videos = [];let confirmationCallback = null;function generateUniqueId() {return Math.random().toString(36).substr(2, 9);}function addFriendForm() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>添加好友</h3><form id="addFriendForm"><div class="form-group"><label for="friendNickname">网名:</label><input type="text" id="friendNickname" required></div><div class="form-group"><label for="friendAge">年龄:</label><input type="number" id="friendAge" min="1" required></div><div class="form-group"><label for="friendGender">性别:</label><select id="friendGender" required><option value="">请选择...</option><option value="male">男</option><option value="female">女</option><option value="other">其他</option></select></div><div class="form-group"><label for="friendAddress">地址:</label><input type="text" id="friendAddress" required></div><div class="form-group"><label for="friendAvatar">头像:</label><input type="file" id="friendAvatar" accept="image/*" required><img id="avatarPreview" class="preview-image" src="" alt="Avatar Preview" style="display:none;"></div><button type="submit">添加好友</button></form>`;document.getElementById('friendAvatar').addEventListener('change', function(event) {const file = event.target.files[0];if (file) {const reader = new FileReader();reader.onload = function(e) {const previewImage = document.getElementById('avatarPreview');previewImage.src = e.target.result;previewImage.style.display = 'block';};reader.readAsDataURL(file);}});document.getElementById('addFriendForm').onsubmit = (event) => {event.preventDefault();const nickname = document.getElementById('friendNickname').value;const age = parseInt(document.getElementById('friendAge').value);const gender = document.getElementById('friendGender').value;const address = document.getElementById('friendAddress').value;const avatarFile = document.getElementById('friendAvatar').files[0];if (!avatarFile) {showMessage('请上传头像');return;}const friendId = generateUniqueId();const reader = new FileReader();reader.onloadend = () => {const avatarUrl = reader.result;friends.push({ id: friendId, nickname, age, gender, address, avatar: avatarUrl, blocked: false });showMessage(`已添加好友 ${nickname}`);showFriends();};reader.readAsDataURL(avatarFile);};}function deleteFriend(index) {confirmationCallback = () => {friends.splice(index, 1);showFriends();};showConfirmation(`确定要删除 ${friends[index].nickname} 吗?`);}function blockFriend(index) {friends[index].blocked = !friends[index].blocked;showMessage(`已将 ${friends[index].nickname} ${friends[index].blocked ? '拉黑' : '取消拉黑'}`);showFriends();}function addToFavoritesForm() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>添加收藏</h3><form id="addFavoriteForm"><div class="form-group"><label for="favoriteContent">收藏内容:</label><textarea id="favoriteContent" rows="4" required></textarea></div><button type="submit">添加收藏</button></form>`;document.getElementById('addFavoriteForm').onsubmit = (event) => {event.preventDefault();const content = document.getElementById('favoriteContent').value;if (content) {favorites.push({ content, likes: 0 });showMessage(`已添加收藏`);showFavorites();}};}function deleteFavorite(index) {confirmationCallback = () => {favorites.splice(index, 1);showFavorites();};showConfirmation(`确定要删除此收藏吗?`);}function likeFavorite(index) {favorites[index].likes++;showFavorites();}function uploadFileForm() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>上传文件</h3><form id="uploadFileForm"><div class="form-group"><label for="fileUpload">选择文件:</label><input type="file" id="fileUpload" required></div><button type="submit">上传文件</button></form>`;document.getElementById('uploadFileForm').onsubmit = (event) => {event.preventDefault();const fileInput = document.getElementById('fileUpload');const file = fileInput.files[0];if (file) {files.push(file);showMessage(`${file.name} 已上传`);showFiles();}};}function downloadFile(index) {const file = files[index];const url = URL.createObjectURL(file);const a = document.createElement('a');a.href = url;a.download = file.name;document.body.appendChild(a);a.click();a.remove();}function deleteFile(index) {confirmationCallback = () => {files.splice(index, 1);showFiles();};showConfirmation(`确定要删除此文件吗?`);}function postMomentForm() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>发布朋友圈</h3><form id="postMomentForm"><div class="form-group"><label for="momentContent">朋友圈内容:</label><textarea id="momentContent" rows="4" required></textarea></div><button type="submit">发布朋友圈</button></form>`;document.getElementById('postMomentForm').onsubmit = (event) => {event.preventDefault();const content = document.getElementById('momentContent').value;if (content) {moments.push({ content, likes: 0 });showMessage(`已发布朋友圈`);showMoments();}};}function deleteMoment(index) {confirmationCallback = () => {moments.splice(index, 1);showMoments();};showConfirmation(`确定要删除此朋友圈吗?`);}function likeMoment(index) {moments[index].likes++;showMoments();}function showVideoForm() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>展示视频</h3><form id="showVideoForm"><div class="form-group"><label for="videoUrl">视频URL:</label><input type="url" id="videoUrl" required></div><button type="submit">展示视频</button></form>`;document.getElementById('showVideoForm').onsubmit = (event) => {event.preventDefault();const videoUrl = document.getElementById('videoUrl').value;if (videoUrl) {videos.push({ url: videoUrl, likes: 0 });showMessage(`已添加视频`);showVideos();}};}function deleteVideo(index) {confirmationCallback = () => {videos.splice(index, 1);showVideos();};showConfirmation(`确定要删除此视频吗?`);}function likeVideo(index) {videos[index].likes++;showVideos();}function updateFriendsList() {const friendsList = document.getElementById('friendsList');friendsList.innerHTML = `<div class="item" οnclick="showFriends()">查看好友</div>`;if (friends.length > 0) {friends.forEach((friend, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${friend.nickname} (${friend.age}) ${friend.blocked ? '(已拉黑)' : ''}`;item.onclick = () => showFriendDetails(index);friendsList.appendChild(item);});}}function updateFavoritesList() {const favoritesList = document.getElementById('favoritesList');favoritesList.innerHTML = `<div class="item" οnclick="showFavorites()">查看收藏</div>`;if (favorites.length > 0) {favorites.forEach((favorite, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${favorite.content.substring(0, 50)}... (${favorite.likes} 点赞)`;item.onclick = () => showFavoriteDetails(index);favoritesList.appendChild(item);});}}function updateFilesList() {const filesList = document.getElementById('filesList');filesList.innerHTML = `<div class="item" οnclick="showFiles()">查看文件</div>`;if (files.length > 0) {files.forEach((file, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${file.name}`;item.onclick = () => showFileDetails(index);filesList.appendChild(item);});}}function updateMomentsList() {const momentsList = document.getElementById('momentsList');momentsList.innerHTML = `<div class="item" οnclick="showMoments()">查看朋友圈</div>`;if (moments.length > 0) {moments.forEach((moment, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${moment.content.substring(0, 50)}... (${moment.likes} 点赞)`;item.onclick = () => showMomentDetails(index);momentsList.appendChild(item);});}}function updateVideosList() {const videosList = document.getElementById('videosList');videosList.innerHTML = `<div class="item" οnclick="showVideos()">查看视频</div>`;if (videos.length > 0) {videos.forEach((video, index) => {const item = document.createElement('div');item.className = 'item';item.innerHTML = `<video src="${video.url}" controls></video> (${video.likes} 点赞)`;item.onclick = () => showVideoDetails(index);videosList.appendChild(item);});}}function showFriends() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>好友列表</h3><button οnclick="addFriendForm()">添加好友</button><div id="friendsContent"></div>`;const friendsContent = document.getElementById('friendsContent');friends.forEach((friend, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${friend.nickname} (${friend.age}) ${genderMap[friend.gender]} ${friend.blocked ? '(已拉黑)' : ''}`;item.onclick = () => showFriendDetails(index);friendsContent.appendChild(item);});}function showFriendDetails(index) {const friend = friends[index];const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>${friend.nickname}</h3><div class="friend-details"><img src="${friend.avatar}" alt="${friend.nickname}'s Avatar"><p>年龄: ${friend.age}</p><p>性别: ${genderMap[friend.gender]}</p><p>地址: ${friend.address}</p><p>状态: ${friend.blocked ? '已拉黑' : '正常'}</p><button οnclick="chatWithFriend(${index})" ${friend.blocked ? 'class="disabled"' : ''}>聊天</button><button οnclick="deleteFriend(${index})">删除好友</button><button οnclick="blockFriend(${index})">${friend.blocked ? '取消拉黑' : '拉黑好友'}</button></div>`;}function chatWithFriend(index) {const friend = friends[index];if (friend.blocked) {showMessage('无法与已拉黑的好友聊天');return;}const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>与 ${friend.nickname} 聊天</h3><div class="messages" id="friendMessages"></div><div class="input-area"><input type="text" id="friendMessageInput" placeholder="输入消息..."><button οnclick="sendFriendMessage(${index})">发送</button></div>`;}function sendFriendMessage(index) {const friendMessageInput = document.getElementById('friendMessageInput');const friendMessagesContainer = document.getElementById('friendMessages');const userMessage = friendMessageInput.value.trim();if (userMessage === '') return;// 创建用户消息元素const userMessageElement = document.createElement('div');userMessageElement.className = 'message user';userMessageElement.textContent = userMessage;friendMessagesContainer.appendChild(userMessageElement);// 添加撤回按钮const revokeButton = document.createElement('button');revokeButton.textContent = '撤回';revokeButton.onclick = () => {friendMessagesContainer.removeChild(userMessageElement);};userMessageElement.appendChild(revokeButton);// 清空输入框friendMessageInput.value = '';// 模拟好友回复setTimeout(() => {const friendReply = `收到:${userMessage}`;const friendMessageElement = document.createElement('div');friendMessageElement.className = 'message bot';friendMessageElement.textContent = friendReply;friendMessagesContainer.appendChild(friendMessageElement);// 自动滚动到底部friendMessagesContainer.scrollTop = friendMessagesContainer.scrollHeight;}, 1000);}function showFavoriteDetails(index) {const favorite = favorites[index];const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>收藏内容</h3><p>${favorite.content}</p><p>点赞数: ${favorite.likes}</p><button οnclick="likeFavorite(${index})">点赞</button><button οnclick="deleteFavorite(${index})">删除收藏</button>`;}function showFileDetails(index) {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>文件详情</h3><p>文件名: ${files[index].name}</p><button οnclick="downloadFile(${index})">下载文件</button><button οnclick="deleteFile(${index})">删除文件</button>`;}function showMomentDetails(index) {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>朋友圈内容</h3><p>${moments[index].content}</p><p>点赞数: ${moments[index].likes}</p><button οnclick="likeMoment(${index})">点赞</button><button οnclick="deleteMoment(${index})">删除朋友圈</button>`;}function showVideoDetails(index) {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>视频详情</h3><video src="${videos[index].url}" controls></video><p>点赞数: ${videos[index].likes}</p><button οnclick="likeVideo(${index})">点赞</button><button οnclick="deleteVideo(${index})">删除视频</button>`;}function showFavorites() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>收藏内容列表</h3><button οnclick="addToFavoritesForm()">新增收藏内容</button><div id="favoritesContent"></div>`;const favoritesContent = document.getElementById('favoritesContent');favorites.forEach((favorite, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${favorite.content.substring(0, 50)}... (${favorite.likes} 点赞)`;item.onclick = () => showFavoriteDetails(index);favoritesContent.appendChild(item);});}function showFiles() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>文件列表</h3><button οnclick="uploadFileForm()">上传文件</button><div id="filesContent"></div>`;const filesContent = document.getElementById('filesContent');files.forEach((file, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${file.name}`;item.onclick = () => showFileDetails(index);filesContent.appendChild(item);});}function showMoments() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>朋友圈列表</h3><button οnclick="postMomentForm()">发布朋友圈</button><div id="momentsContent"></div>`;const momentsContent = document.getElementById('momentsContent');moments.forEach((moment, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${moment.content.substring(0, 50)}... (${moment.likes} 点赞)`;item.onclick = () => showMomentDetails(index);momentsContent.appendChild(item);});}function showVideos() {const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>视频列表</h3><button οnclick="showVideoForm()">展示视频</button><div id="videosContent"></div>`;const videosContent = document.getElementById('videosContent');videos.forEach((video, index) => {const item = document.createElement('div');item.className = 'item';item.innerHTML = `<video src="${video.url}" controls></video> (${video.likes} 点赞)`;item.onclick = () => showVideoDetails(index);videosContent.appendChild(item);});}function showConfirmation(message) {const contentArea = document.getElementById('contentArea');contentArea.innerHTML += `<div class="confirmation-message" id="confirmationMessage"><p>${message}</p><div class="confirmation-buttons"><button οnclick="confirmAction()">确认</button><button οnclick="cancelAction()">取消</button></div></div>`;}function confirmAction() {if (confirmationCallback) {confirmationCallback();confirmationCallback = null;}hideConfirmation();}function cancelAction() {confirmationCallback = null;hideConfirmation();}function hideConfirmation() {const confirmationMessage = document.getElementById('confirmationMessage');if (confirmationMessage) {confirmationMessage.remove();}}function showMessage(message) {const contentArea = document.getElementById('contentArea');contentArea.innerHTML += `<div class="confirmation-message" id="confirmationMessage"><p>${message}</p></div>`;setTimeout(hideConfirmation, 3000); // Hide after 3 seconds}function searchFriends(query) {const filteredFriends = friends.filter(friend =>friend.nickname.toLowerCase().includes(query.toLowerCase()));const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>搜索结果</h3><div id="searchResults"></div>`;const searchResults = document.getElementById('searchResults');if (filteredFriends.length > 0) {filteredFriends.forEach((friend, index) => {const item = document.createElement('div');item.className = 'item';item.textContent = `${friend.nickname} (${friend.age}) ${genderMap[friend.gender]} ${friend.blocked ? '(已拉黑)' : ''}`;item.onclick = () => showSearchFriendDetails(filteredFriends, index);searchResults.appendChild(item);});} else {searchResults.innerHTML = '<p>没有找到匹配的好友</p>';}}function performSearch() {const query = document.getElementById('searchInput').value;if (query.trim()) {searchFriends(query);} else {showFriends(); // Reset to full list if search is cleared}}function showSearchFriendDetails(filteredFriends, index) {const friend = filteredFriends[index];const contentArea = document.getElementById('contentArea');contentArea.innerHTML = `<h3>${friend.nickname}</h3><div class="friend-details"><img src="${friend.avatar}" alt="${friend.nickname}'s Avatar"><p>年龄: ${friend.age}</p><p>性别: ${genderMap[friend.gender]}</p><p>地址: ${friend.address}</p><p>状态: ${friend.blocked ? '已拉黑' : '正常'}</p><button οnclick="chatWithFriend(${friends.indexOf(friend)})" ${friend.blocked ? 'class="disabled"' : ''}>聊天</button><button οnclick="deleteFriend(${friends.indexOf(friend)})">删除好友</button><button οnclick="blockFriend(${friends.indexOf(friend)})">${friend.blocked ? '取消拉黑' : '拉黑好友'}</button></div>`;}// Gender mappingconst genderMap = {male: '男',female: '女',other: '其他'};// 初始化列表updateFriendsList();updateFavoritesList();updateFilesList();updateMomentsList();updateVideosList();</script>
</body>
</html>

3.效果展示

在这里插入图片描述

相关文章:

使用html 和javascript 实现微信界面功能2

1.功能说明&#xff1a; 对上一篇的基础上进行了稍稍改造 主要修改点&#xff1a; 搜索功能: 在搜索框后面增加了搜索按钮。 搜索按钮调用performSearch函数来执行搜索操作。 表单形式的功能: 上传文件: 修改为表单形式&#xff0c;允许用户通过文件输入控件选择文件并上传。 …...

虚幻引擎Actor类生命周期

AActor构造函数 在AActor类的构造函数中,虚幻引擎会初始化与该Actor相关的一些关键属性,比如: 默认的组件(如RootComponent、MeshComponent等)。默认的属性设置,例如位置、旋转、缩放等。还会调用BeginPlay等生命周期函数,但在构造函数中,这些函数不会执行。当你在场景…...

记录2024-leetcode-字符串DP

10. 正则表达式匹配 - 力扣&#xff08;LeetCode&#xff09;...

爬虫获取的数据如何有效存储和管理?

爬虫获取的数据如何有效存储和管理&#xff0c;涉及到数据的采集、存储、清洗、分析和保护等多个方面。以下是一些关键步骤和最佳实践&#xff1a; 1. 数据采集与同步 API接口同步&#xff1a;通过API接口将数据从数据源传输到目标位置&#xff0c;并保持数据的一致性和完整性…...

[Unity] AppLovin Max接入Native 广告 IOS篇

NativeIOS构建流程 &#xff08;接入之前备份之前打包得Xcode工程&#xff09; 下载资源 1.将以下文件放入Unity Assets->Plugins->IOS文件夹下 2.Unity更新max版本至12.4.1 UnityPlugin 6.4.3以上&#xff08;很重要&#xff09; 3.NativeSDKManager.CS根据以下附…...

康耐视智能相机(Insight)通过ModbusTCP发送字符串到倍福(BECKHOFF)PLC中

文章目录 1.背景2.分析3.实现3.1.PLC的ModbusTCP_Server3.1.1.安装TF6250-Modbus-TCP3.1.2.PLC设置 3.2.智能相机的ModbusTCP_Client3.2.1.了解ModbusTCP的协议3.2.2.根据协议写代码3.2.2.1.纯函数代码3.2.2.2.脚本代码 3.2.3.非脚本处理时的代码逻辑图3.2.4.关于代码的问题及解…...

TIFS投稿记录(IEEE Transactions on Information Forensics Security)

毕竟是CCF A类期刊&#xff0c;TIFS审稿有点慢&#xff0c;记录最近一篇论文的投稿时间线。 2024年10月27日&#xff1a;提交。 2024年11月12日&#xff1a;分配DE。 2024年12月3日&#xff1a;AE与SAE还未分配。发邮件催了催。 2024年12月5日&#xff1a;SAE已分配。AE: Not A…...

极越汽车,加速跌落

文丨梅元知 9月&#xff0c;极越销量2605辆&#xff1b;10月进一步攀升到3107辆&#xff0c;尽管11月略有回落&#xff0c;销量跌至2485辆&#xff0c;但对于一个品牌影响力尚未完全建立、销售渠道有限的新品牌而言&#xff0c;这样的表现已实属不易。然而&#xff0c;就在看似…...

深入解析MySQL事务隔离级别与锁机制在银行账户业务中的应用

一、引言 在金融行业&#xff0c;尤其是银行账户业务中&#xff0c;数据的一致性和安全性至关重要。MySQL作为一种广泛使用的数据库&#xff0c;其事务隔离级别和锁机制在保证数据一致性方面发挥着重要作用。本文将针对银行账户查询与转账业务&#xff0c;探讨如何运用事务锁来…...

postman可以通的请求,前端通不了(前端添加Content-type,后端收不到请求)

接口完成之后,自己使用postman测试了一下,没有问题; 可是在和小组前端调试接口的时候,他却说访问不了; 信息如下:(我自己写的一个打印请求信息的拦截器) 发现报错信息是: Content type ‘application/x-www-form-urlencoded;charset=UTF-8’ not supported 也就是说…...

【Java计算机毕业设计】基于SSM+VUE宠物领养管理系统【源代码+数据库+LW文档+开题报告+答辩稿+部署教程+代码讲解】

源代码数据库LW文档&#xff08;1万字以上&#xff09;开题报告答辩稿 部署教程代码讲解代码时间修改教程 一、开发工具、运行环境、开发技术 开发工具 1、操作系统&#xff1a;Window操作系统 2、开发工具&#xff1a;IntelliJ IDEA或者Eclipse 3、数据库存储&#xff1a…...

排队论、负载均衡和任务调度关系

目录 排队论、负载均衡和任务调度关系 一、排队论 二、负载均衡 三、任务调度 四、总结 排队论、负载均衡和任务调度关系 排队论为负载均衡和任务调度提供了数学理论和方法支持 排队论、负载均衡和任务调度是三个相关但不同的概念。以下是对这三个概念的详细解释和它们之…...

智能客户服务:科技赋能下的新体验

在当今这个数字化时代&#xff0c;客户服务已经不仅仅是简单的售后服务&#xff0c;它已竞争的关键要素之一。随着人工智能、大数据、云计算等技术的飞速发展&#xff0c;智能客户服务正逐步改变着传统的服务模式&#xff0c;为企业和消费者带来了前所未有的新体验。 一、智能客…...

代码随想录第45天

115.不同的子序列 class Solution:def numDistinct(self, s: str, t: str) -> int:n1 len(s)n2 len(t)dp [[0] * (n1 1) for _ in range(n2 1)]for j in range(n1 1):dp[0][j] 1for i in range(1, n2 1):for j in range(1, n1 1):if t[i - 1] s[j - 1]:dp[i][j]…...

前端项目初始化搭建(二)

一、使用 Vite 创建 Vue 3 TypeScript 项目 PS E:\web\cursor-project\web> npm create vitelatest yf-blog -- --template vue-ts> npx > create-vite yf-blog --template vue-tsScaffolding project in E:\web\cursor-project\web\yf-blog...Done. Now run:cd yf-…...

3D 目标检测:从萌芽到前沿的技术演进之路

亲爱的小伙伴们&#x1f618;&#xff0c;在求知的漫漫旅途中&#xff0c;若你对深度学习的奥秘、JAVA 、PYTHON与SAP 的奇妙世界&#xff0c;亦或是读研论文的撰写攻略有所探寻&#x1f9d0;&#xff0c;那不妨给我一个小小的关注吧&#x1f970;。我会精心筹备&#xff0c;在…...

Apifox 产品更新|支持发布多个文档站、文档站支持 Algolia 搜索配置、从返回响应直接设置断言

看看本次 这次版本更新主要涵盖的重点内容&#xff0c;有没有你所关注的功能特性&#xff1a; 「发布文档」升级为「发布文档站」 支持发布多个文档站 文档站支持 Algolia 搜索配置 支持从返回响应直接设置断言 用户反馈优化 解决恢复退出 App 时未关闭的标签页可能导致内存…...

Linux内核结构及源码概述

参考&#xff1a;深入分析LINUX内核源码 深入分析Linux内核源码 (kerneltravel.net) Linux 是一个庞大、高效而复杂的操作系统&#xff0c;虽然它的开发起始于 Linus Torvalds 一个人&#xff0c;但随着时间的推移&#xff0c;越来越多的人加入了 Linux 的开发和对它的不断完善…...

《探索C++在3D重建中的算法与技术要点》

3D重建作为计算机视觉领域的重要技术&#xff0c;在诸多行业有着广泛应用&#xff0c;而C以其高效性和对底层硬件的良好控制&#xff0c;成为实现3D重建算法的常用语言。以下是利用C进行3D重建的一些常见算法和技术要点。 多视图立体视觉算法 多视图立体视觉是3D重建的基础算…...

【老白学 Java】数字格式化

数字格式化 文章来源&#xff1a;《Head First Java》修炼感悟。 很多时候需要对数字或日期进行格式化操作&#xff0c;来达到某些输出效果。Java 的 Formatter 类提供了很多扩展性功能用于字符串的格式化&#xff0c;只要调用 String 静态方法 format() &#xff0c;传入参数…...

RestClient

什么是RestClient RestClient 是 Elasticsearch 官方提供的 Java 低级 REST 客户端&#xff0c;它允许HTTP与Elasticsearch 集群通信&#xff0c;而无需处理 JSON 序列化/反序列化等底层细节。它是 Elasticsearch Java API 客户端的基础。 RestClient 主要特点 轻量级&#xff…...

超短脉冲激光自聚焦效应

前言与目录 强激光引起自聚焦效应机理 超短脉冲激光在脆性材料内部加工时引起的自聚焦效应&#xff0c;这是一种非线性光学现象&#xff0c;主要涉及光学克尔效应和材料的非线性光学特性。 自聚焦效应可以产生局部的强光场&#xff0c;对材料产生非线性响应&#xff0c;可能…...

基于服务器使用 apt 安装、配置 Nginx

&#x1f9fe; 一、查看可安装的 Nginx 版本 首先&#xff0c;你可以运行以下命令查看可用版本&#xff1a; apt-cache madison nginx-core输出示例&#xff1a; nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...

postgresql|数据库|只读用户的创建和删除(备忘)

CREATE USER read_only WITH PASSWORD 密码 -- 连接到xxx数据库 \c xxx -- 授予对xxx数据库的只读权限 GRANT CONNECT ON DATABASE xxx TO read_only; GRANT USAGE ON SCHEMA public TO read_only; GRANT SELECT ON ALL TABLES IN SCHEMA public TO read_only; GRANT EXECUTE O…...

【C语言练习】080. 使用C语言实现简单的数据库操作

080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码:使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出:5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作 在…...

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

rnn判断string中第一次出现a的下标

# coding:utf8 import torch import torch.nn as nn import numpy as np import random import json""" 基于pytorch的网络编写 实现一个RNN网络完成多分类任务 判断字符 a 第一次出现在字符串中的位置 """class TorchModel(nn.Module):def __in…...

华硕a豆14 Air香氛版,美学与科技的馨香融合

在快节奏的现代生活中&#xff0c;我们渴望一个能激发创想、愉悦感官的工作与生活伙伴&#xff0c;它不仅是冰冷的科技工具&#xff0c;更能触动我们内心深处的细腻情感。正是在这样的期许下&#xff0c;华硕a豆14 Air香氛版翩然而至&#xff0c;它以一种前所未有的方式&#x…...

Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档&#xff09;&#xff0c;如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下&#xff0c;风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...

C/C++ 中附加包含目录、附加库目录与附加依赖项详解

在 C/C 编程的编译和链接过程中&#xff0c;附加包含目录、附加库目录和附加依赖项是三个至关重要的设置&#xff0c;它们相互配合&#xff0c;确保程序能够正确引用外部资源并顺利构建。虽然在学习过程中&#xff0c;这些概念容易让人混淆&#xff0c;但深入理解它们的作用和联…...