how2js
how2js

Next.js如何引入百度分享(外部引用)类似的外部js，以及如何操作window

前言

近期使用React官方推荐的服务端渲染工具Next.js进行服务端页面编程时遇到引入百度分享等外部JS文件的问题。

Next.js可以使用内置组件来装在 到页面中

import Head from 'next/head'

export default () =>
  <div>
    <Head>
      <title>My page title</title>
      <meta name="viewport" content="initial-scale=1.0, width=device-width" />
    </Head>
    <p>Hello world!</p>
  </div>

那么我们就可以用这个特性引入外部js文件了，下面是引入百度分享的例子：

import Head from 'next/head'

export default () =>
 <div>
  <Head>
  <title>My page title</title>
  <meta name="viewport" content="initial-scale=1.0, width=device-width" />
	<script>
	    {
	    `             
	with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
	`
		}
	
	</script>
</Head>
 </div>

这样就很好解决了怎么引入类似百度分享一类的外部js文件的问题，但是百度分享自身会存在一个问题：百度分享异步操作加载进页面的时候不会立即渲染，因为因为百度分享执行后，会创建全局的window.__bd_share_main，所以 需要在 ajax请求完成后执行一下window.__bd_share_main.init();

但是由于window操作是客户端行为，而Next.js自身是服务端渲染(SSR)的原因是没有window对象的，解决办法是利用Next.js动态导入，官方文档有说明，动态导入是可以禁止SSR的,如下：

import dynamic from 'next/dynamic'

const DynamicComponentWithNoSSR = dynamic(import('../components/hello3'), {
  ssr: false
})

export default () =>
  <div>
    <Header />
    <DynamicComponentWithNoSSR />
    <p>HOME PAGE is here!</p>
  </div>

像官方文档一样动态引入百度分享所在组件即可解决问题了

// 禁止ssr
const ShareCol = dynamic(import('../components/sharecol'),{ssr:false})

百度分享组件中，在componentDidMount钩子函数中操作如下

componentDidMount(){
 
    if(window._bd_share_main){         
        window._bd_share_main.init();
    }    
   
   
}

其他类似的外部引入问题也可以这样解决

你可能感兴趣的:(React)

  • nextjs+react接口会请求两次？
    解决Next.js+React接口重复请求问题在Next.js应用中，你可能会遇到API请求被发送两次的情况。以下是常见原因和解决方案：1.开发模式下StrictMode的影响原因Next.js默认启用React的StrictMode，在开发环境下会故意渲染两次组件以帮助发现潜在问题。解决方案//next.config.jsmodule.exports={reactStrictMode:false
  • gpt面试题 任小栗 #面试题gptvue.js前端
    vue面试题一、响应式系统相关❓1.Vue3的响应式系统是如何实现的？和Vue2有何本质区别？答案：Vue3使用Proxy实现响应式（位于@vue/reactivity模块），替代Vue2的Object.defineProperty。核心机制如下：使用targetMap:WeakMap存储依赖关系利用track()和trigger()方法实现依赖收集与派发更新effect()包装副作用函数，自动收
  • 推荐：React与WebRTC构建的1对1视频聊天应用 潘俭渝Erik
    推荐：React与WebRTC构建的1对1视频聊天应用去发现同类优质开源项目:https://gitcode.com/在这个数字化的时代，实时通信技术为我们提供了无限的可能性，而WebRTC（WebReal-TimeCommunication）正是其中的佼佼者。今天，我们向您推荐一个基于React框架实现的简单1对1视频聊天室示例项目，它集成了WebRTC和屏幕共享API，为学习和实践WebRTC
  • Flutter-VS-Kotlin-跨平台开发市场的最终由谁统治？
    曾经有一段时间，跨平台开发就是"使用ReactNative和Flutter构建应用"的代名词。个人开发者和移动应用开发公司都会依赖这两个框架，从而以更加经济和高效的方式同时在Android和iOS上推出自己的产品。但是现在，Kotlin也加入了这场竞赛。谷歌甚至宣布Kotlin现在是Android应用程序开发人员的首选语言。于是所有人都想知道谁将成为跨平台开发市场的最终统治者。我们在早些时候已经对
  • React Native Android全栈开发：如何构建企业级应用 AI天才研究院 AI人工智能与大数据reactnativeandroidreact.jsai
    ReactNativeAndroid全栈开发：如何构建企业级应用关键词：ReactNative、Android集成、企业级应用、跨平台开发、性能优化摘要：本文从企业级应用开发的实际需求出发，结合ReactNative（以下简称RN）与Android的技术特性，系统讲解如何从0到1构建高可用、易维护的跨平台移动应用。内容涵盖核心概念解析、Android端集成技巧、企业级架构设计、性能优化实战及未来趋
  • ReactNative 0.69发布 wayne214 前端
    ReactNative0.69正式版发布了，主要带来如下几点：1.React18的支持2.默认绑定引擎HermesReact18ReactNative0.69是第一个支持React18的正式版本。React18提供了更多提升，比如新的hookapi，userId等。此外，React18包括新的并发特性，例如useTransition或完整的Suspense支持。React18的更新后全面支持Sus
  • vue中实现验证码输入 结城 vue验证码vue输入框
    vue验证码input输入解决焦点切换有点晚了就不吐槽了，咱还是把代码上了，赶紧洗澡，养好精神明天努力上班！！！想学node,想学react,想精进webpack,想vue学的更好一点，了解底层代码，学算法，学计算机原理，想写自己的博客网站…这是一条学无止境的路，没办法要恰饭效果html部分js部分exportdefault{props:{inputNums:{type:Number,defaul
  • 浅析Vue3(vue3笔记之进阶篇) 唆键盘的小前端 Javascript前端vue笔记vue.js前端前端框架javascriptwindows
    本文是结合实践中和学习技术文章总结出来的笔记(个人使用),如有雷同纯属正常((✿◠‿◠))喜欢的话点个赞,谢谢!有问题欢迎指正!!前面已经讲了基本的Vue生命周期和入门知识,本篇重点介绍Vue3的一些进阶知识1.vue-router路由Vue的路由对比React真是舒服太多了,路由守卫不需要自己配置,还可以方便自己添加一些自定义逻辑,比如在beforeEach加载进度条之类的,这里以Hash路由为
  • React 最新版本（hooks写法） 抬头第一眼，是天 Reactreact.jsjavascript前端
    React目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录React目录前言一、指令jsx语法：需要注意的是：react的类名class变成了className，事件从onClick，因为class是react的内部关键字动态数据useState()相当于Vue3的ref（），reactive（）条件渲染列
  • React Native 0.80 重磅发布：升级 React 19.1，冻结旧架构，开启开发新体验 [特殊字符] wayne214 reactnative
    核心亮点速览ReactNative0.80版本于2025年6月12日正式发布！本次更新围绕稳定性提升、架构升级和开发体验优化，带来多项重要变化。以下是值得关注的核心内容：一、升级至React19.1，强化错误定位能力React版本升级：内置React运行时升级至19.1.0，带来更稳定的组件渲染和状态管理。OwnerStacks功能：新增开发阶段错误追踪能力，可直观定位引发异常的组件层级，辅助快速
  • 业务流逻辑如何搭建？为何橙武平台选用了 LogicFlow？ 橙武科技 低代码低代码
    前言在橙武低代码平台的架构设计中，“业务逻辑编排”并不是锦上添花的功能，而是决定平台扩展能力的根基之一。对内，它承担着流程驱动、条件分支、异步节点、子流程等任务；对外，它决定了平台能否真正支持多行业、多租户的复杂业务建模需求。我们评估过包括BPMN.js、ReactFlow、AntVG6、JointJS等多种图形与流程编排引擎，最终选择了滴滴开源的LogicFlow作为橙武平台的核心业务流程引擎。
  • react（基础篇） 盛码笔记 react.jsjavascript前端
    React由Meta公司研发，用于构建Web和原生交互界面的库。React官方中文文档查看JSX（一）React组件用户界面的一部分，通俗的来讲，最小的元素组成的单元，可以实现部分逻辑与功能房子的门就可以看成一个组件，由木板和木方组成，有一定功能和作用，多个组件组合就可以形成房子了。组件之间可以相互嵌套，重复使用React组件React中，组件就是一个首字母大写的函数，内部存放组件的逻辑和视图UI
  • Taro 网络 API 详解与实用案例
    Taro网络API详解与实用案例在现代前端开发中，网络通信是不可或缺的一环。Taro作为一款多端开发框架，提供了丰富且统一的网络API，帮助开发者在小程序、H5、ReactNative等多端环境下高效地进行数据交互。本文将详细介绍Taro的四大网络API：Taro.request、Taro.uploadFile、Taro.downloadFile和Taro.connectSocket，并结合实际案
  • echarts 随窗口的移动，改变图表size StrongerIrene echartsjavascript前端
    错误写法：//错误原因：依赖项数组的用法不符合React响应式原理useEffect(()=>{//...},[PieRef,PieRef.current?.clientHeight,PieRef.current?.clientHeight]);关键问题：以上三点得出：这个pieref这样子盯着变动是无效的。正确的写法是，关键点在resizeObserver这里，类似intercetionobse
  • forwardRef ：打破函数组件封装限制的技巧
    在React开发中，我们经常会遇到这样一个需求：如何让父组件直接访问子组件内部的DOM元素或组件实例？例如，点击按钮时自动聚焦某个输入框，或者直接调用子组件的方法。当你面对这样的需求时，你第一时间可能会想到组件通信的方式，通过props传递数据和回调函数，然而，组件通信并不能满足直接访问子组件内部DOM或实例的需求。为了解决这个问题，React提供了React.forwardRef这一特殊机制，本
  • react动态增加input框20180828 穆罕周 react
    react动态增加input框20180828先在render里写好渲染的方法和点击的方法：二、点击的时候，先获取“记录新建或减少的描述字段的限制个数的数组”和“储存新增描述字段的input框的输入值数组”，若在限制个数之内，则同时给两者增加一个空元素渲染的时候，会根据限制个数的数组长度来return多少个input框，同时，显示的value值也是根据第几个i和储存值的数组的下标来匹配一一对应输入
  • ReactJS与Node.js：前后端整合之道
    背景简介在当前的Web开发领域中，ReactJS作为前端框架的佼佼者，其组件化和声明式的编程方式广受开发者喜爱。而Node.js作为后端技术的热门选择，也因其实时、非阻塞I/O的特性而大放异彩。当ReactJS与Node.js结合时，我们可以构建出全栈的应用程序，实现从前端到后端的无缝对接。本文将从ReactJS与FacebookAPI的集成讲起，逐步过渡到使用Node.js来构建React应用的
  • nextjs学习笔记 ainuo5213 web前端框架学习nextreactreact服务端渲染next入门
      由于本人最近在学习jocky老师的React16.8+Next.js+Koa2开发Github全栈项目关于react的服务端重构项目，然后跟着老师的视频做笔记，记录下自己的所学知识。目录结构pages(必需)：pages目录是nextjs中最终要的一个目录，这个目录的每一个文件都会对应到每一个页面，可以根据地址栏的路由进行跳转。若pages下的js文件在一个目录下，那么nextjs默认会将这个
  • next.js刷新页面时二级菜单展开状态判断 啃火龙果的兔子 开发DEMOjavascript前端react.js
    在Next.js中保持二级菜单刷新后展开状态的解决方案在Next.js应用中，当页面刷新时保持二级菜单的展开状态，可以通过以下几种方法实现：方法1：使用URL参数保存状态（推荐）import{useRouter}from'next/router';import{useEffect,useState}from'react';constMenuComponent=()=>{constrouter=us
  • 用项目说话：我的React博客构建成果与经验复盘 Pan Zonghui 移动端react项目总结react.js前端前端框架
    这是一个基于React19+TypeScript+Vite构建的现代化博客系统，采用了最新的前端技术栈和工程化实践。项目不仅实现了完整的博客功能，更在架构设计、性能优化、开发体验等方面体现了企业级应用的标准。成品展示个人博客链接地址：https://pzhdv.cnpc端页面展示首页分类页面关于我文章详情页面移动端技术栈选择与分层设计技术栈选择核心框架与工具React19.1.0:最新版本的Rea
  • DHTMLX Suite 9.2 重磅发布：支持历史记录、类Excel交互、剪贴板、拖放增强等多项升级
    全球知名的JavaScriptUI组件库DHTMLXSuite迎来9.2新版本！此次更新虽为次版本号，却实质性提升了Grid网格组件的交互能力与用户体验，引入了包括历史记录管理、剪贴板操作、数据选择范围管理、Block区块选择等多项高级模块，支持更接近电子表格的使用体验。新版Grid组件不仅在数据可视化、数据编辑方面功能更强，还增强了与主流前端框架（如React、Vue、Angular）的集成示例
  • （2）React的JSX语法 __method__
    JSX−JSX是JavaScript语法的扩展。React开发不一定使用JSX，但我们建议使用它。要使用自定义的组件，要以大写字母开始自行编辑一个todolist页面首先在src下面创建src/TodoList.js，输入以下代码importReact,{Component}from"react";classTodoListextendsComponent{render(){return(todo
  • 前端实现抛物线小球动画效果：从原理到代码实践 编程随想▿ 前端抛物线JSvuereact.js
    目录引言一、抛物线动画的核心原理二、纯HTML/CSS实现抛物线动画1.HTML结构2.CSS动画3.效果说明三、动态交互：JavaScript实现抛物线动画1.HTML结构2.JavaScript逻辑3.效果说明四、Vue.js实现抛物线动画1.组件结构2.实现思路五、React实现抛物线动画1.组件代码2.实现思路六、注意事项七、总结引言在前端开发中，动画效果是提升用户体验的重要手段之一。抛物
  • Sequential Thinking：AI深度思考的新范式及其与CoT、ReAct的对比分析 码字的字节 人工智能SequentialCoTReAct
    引言：AI深度思考的演进与SequentialThinking的崛起在人工智能技术快速发展的今天，AI模型的思考能力正经历着从简单应答到深度推理的革命性转变。这一演进过程不仅反映了技术本身的进步，更体现了人类对机器智能认知边界的持续探索。早期的大语言模型虽然能够生成流畅的文本，但在处理复杂问题时往往表现出"浅思考"的局限性——答案可能看似合理，却缺乏严谨的推理过程和系统性考量。例如，2022年的一
  • react/vue vite ts项目中，自动引入路由文件、 import.meta.glob动态引入路由 无需手动引入 初遇你时动了情 react.jsvue.jsjavascript
    utils/autoRouteHelper.ts//src/utils/autoRouteHelper.tsimport{lazy}from"react";importwithLoadingfrom"@/components/router/withLoading";/**自动生成某个文件夹下的子路由*/interfaceRouteItem{path:string;element?:any;chil
  • 前端框架对比与选择：全面解析前端开发的得力助手 @sinner 技术选型前端前端框架
    一、引言在当今快速发展的互联网时代，前端开发扮演着至关重要的角色。前端框架的出现极大地提高了开发效率、提升了用户体验。然而，市场上存在着众多的前端框架，如React、Vue、Angular等，对于开发者来说，如何在这些框架中做出合适的选择成为了一个关键问题。本文将对一些主流的前端框架进行深入对比，分析它们的特点、优势、劣势以及适用场景，希望能为广大开发者在前端框架的选择上提供有益的参考。二、Rea
  • 2025年面试官常用的前端开发笔试考题 豆豆（前端开发+ui设计） vue.jsjavascript前端面试职场和发展
    填空题(20道)ReactHooks中，用于模拟类组件生命周期componentDidMount的Hook是________。useEffect在Vue3中，使用________API可以替代Vue2中的data和methods。CompositionWebpack的________插件可以帮助将CSS提取到单独的文件中。MiniCssExtractPlugin在JavaScript中，Promi
  • 前端开发好用的AI工具介绍 爱分享的程序员 人工智能AI相关人工智能
    以下是前端开发中提升效率的AI工具推荐，涵盖代码生成、UI设计、调试优化等场景：一、代码生成与辅助工具工具名称特点适用场景GitHubCopilot基于OpenAI，智能代码补全（支持JS/TS/React/Vue）快速生成代码片段、函数逻辑Codeium免费开源，多语言支持，IDE插件丰富（VSCode/WebStorm）代码补全、注释生成AmazonCodeWhispererAWS生态集成，支
  • React 英语打地鼠游戏——一个寓教于乐的英语学习游戏 伍哥的传说 前端源码分享react.js游戏学习
    英语打地鼠游戏一个寓教于乐的英语学习游戏，通过经典的打地鼠玩法帮助用户学习英语单词。✨项目特色游戏化学习经典打地鼠玩法：6个洞穴，听英文选单词即时反馈：答对/答错立即语音提示计分系统：每答对一题得10分，激发学习动力60秒限时：紧张刺激的游戏节奏多媒体体验双语语音播报：英文单词标准发音+中文反馈流畅动画效果：基于Anime.js的精美动画响应式设计：支持手机、平板、电脑多端适配丰富词库多主题分类：
  • React Native 自动化测试终极指南：从零开始到持续集成 老猿阿浪 测试reactnativereact.js集成测试单元测试测试工具
    写在前面：为什么你的ReactNative应用需要自动化测试？想象一下：你刚发布了一个新版本，用户反馈登录页面崩溃了。你紧急修复，重新打包，AppStore审核等了3天，终于上线——结果另一个隐藏Bug又炸了……如果能提前发现这些问题呢？自动化测试就是你的“代码保镖”，它能在你提交代码时自动检查逻辑错误、UI错位、性能问题，甚至模拟用户操作，确保每次改动不会破坏已有功能。本篇将带你从单元测试到E2
  • java杨辉三角 3213213333332132 java基础
    package com.algorithm; /** * @Description 杨辉三角 * @author FuJianyong * 2015-1-22上午10:10:59 */ public class YangHui { public static void main(String[] args) { //初始化二维数组长度 int[][] y
  • 《大话重构》之大布局的辛酸历史 白糖_ 重构
    《大话重构》中提到“大布局你伤不起”，如果企图重构一个陈旧的大型系统是有非常大的风险，重构不是想象中那么简单。我目前所在公司正好对产品做了一次“大布局重构”，下面我就分享这个“大布局”项目经验给大家。   背景         公司专注于企业级管理产品软件，企业有大中小之分，在2000年初公司用JSP/Servlet开发了一套针对中
  • 电驴链接在线视频播放源码 dubinwei 源码电驴播放器视频ed2k
    本项目是个搜索电驴（ed2k）链接的应用,借助于磁力视频播放器（官网： http://loveandroid.duapp.com/ 开放平台），可以实现在线播放视频，也可以用迅雷或者其他下载工具下载。 项目源码： http://git.oschina.net/svo/Emule,动态更新。也可从附件中下载。 项目源码依赖于两个库项目，库项目一链接： http://git.oschina.
  • Javascript中函数的toString()方法 周凡杨 JavaScriptjstoStringfunctionobject
    简述     The toString() method returns a string representing the source code of the function.     简译之，Javascript的toString()方法返回一个代表函数源代码的字符串。 句法     function.
  • struts处理自定义异常 g21121 struts
    很多时候我们会用到自定义异常来表示特定的错误情况，自定义异常比较简单，只要分清是运行时异常还是非运行时异常即可，运行时异常不需要捕获，继承自RuntimeException，是由容器自己抛出，例如空指针异常。 非运行时异常继承自Exception，在抛出后需要捕获，例如文件未找到异常。 此处我们用的是非运行时异常，首先定义一个异常LoginException: /** * 类描述：登录相
  • Linux中find常见用法示例 510888780 linux
    Linux中find常见用法示例 ·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \; find命令的参数；
  • SpringMVC的各种参数绑定方式 Harry642 springMVC绑定表单
    1. 基本数据类型(以int为例，其他类似)： Controller代码： @RequestMapping("saysth.do") public void test(int count) { } 表单代码： <form action="saysth.do" method="post&q
  • Java 获取Oracle ROWID aijuans javaoracle
    A ROWID is an identification tag unique for each row of an Oracle Database table. The ROWID can be thought of as a virtual column, containing the ID for each row. The oracle.sql.ROWID class i
  • java获取方法的参数名 antlove javajdkparametermethodreflect
    reflect.ClassInformationUtil.java package reflect; import javassist.ClassPool; import javassist.CtClass; import javassist.CtMethod; import javassist.Modifier; import javassist.bytecode.CodeAtt
  • JAVA正则表达式匹配 查找 替换 提取操作 百合不是茶 java正则表达式替换提取查找
    正则表达式的查找;主要是用到String类中的split();       String str;      str.split();方法中传入按照什么规则截取,返回一个String数组   常见的截取规则: str.split("\\.")按照.来截取 str.
  • Java中equals()与hashCode()方法详解 bijian1013 javasetequals()hashCode()
    一.equals()方法详解     equals()方法在object类中定义如下：  public boolean equals(Object obj) { return (this == obj); }    很明显是对两个对象的地址值进行的比较（即比较引用是否相同）。但是我们知道，String 、Math、I
  • 精通Oracle10编程SQL(4)使用SQL语句 bijian1013 oracle数据库plsql
    --工资级别表 create table SALGRADE ( GRADE NUMBER(10), LOSAL NUMBER(10,2), HISAL NUMBER(10,2) ) insert into SALGRADE values(1,0,100); insert into SALGRADE values(2,100,200); inser
  • 【Nginx二】Nginx作为静态文件HTTP服务器 bit1129 HTTP服务器
     Nginx作为静态文件HTTP服务器 在本地系统中创建/data/www目录，存放html文件(包括index.html) 创建/data/images目录，存放imags图片 在主配置文件中添加http指令   http { server { listen 80; server_name
  • kafka获得最新partition offset blackproof kafkapartitionoffset最新
    kafka获得partition下标，需要用到kafka的simpleconsumer   import java.util.ArrayList; import java.util.Collections; import java.util.Date; import java.util.HashMap; import java.util.List; import java.
  • centos 7安装docker两种方式 ronin47
          第一种是采用yum 方式              yum install -y docker           
  • java-60-在O(1)时间删除链表结点 bylijinnan java
    public class DeleteNode_O1_Time { /** * Q 60 在O(1)时间删除链表结点 * 给定链表的头指针和一个结点指针(!!)，在O(1)时间删除该结点 * * Assume the list is: * head->...->nodeToDelete->mNode->nNode->..
  • nginx利用proxy_cache来缓存文件 cfyme cache
    user  zhangy users; worker_processes 10; error_log  /var/vlogs/nginx_error.log  crit; pid        /var/vlogs/nginx.pid; #Specifies the value for ma
  • [JWFD开源工作流]JWFD嵌入式语法分析器负号的使用问题 comsci 嵌入式
        假如我们需要用JWFD的语法分析模块定义一个带负号的方程式，直接在方程式之前添加负号是不正确的，而必须这样做：     string str01 = "a=3.14;b=2.71;c=0;c-((a*a)+(b*b))"     定义一个0整数c,然后用这个整数c去
  • 如何集成支付宝官方文档 dai_lm android
    官方文档下载地址 https://b.alipay.com/order/productDetail.htm?productId=2012120700377310&tabId=4#ps-tabinfo-hash 集成的必要条件 1. 需要有自己的Server接收支付宝的消息 2. 需要先制作app，然后提交支付宝审核，通过后才能集成 调试的时候估计会真的扣款，请注意
  • 应该在什么时候使用Hadoop datamachine hadoop
    原帖地址：http://blog.chinaunix.net/uid-301743-id-3925358.html 存档，某些观点与我不谋而合，过度技术化不可取，且hadoop并非万能。 --------------------------------------------万能的分割线-------------------------------- 有人问我，“你在大数据和Hado
  • 在GridView中对于有外键的字段使用关联模型进行搜索和排序 dcj3sjt126com yii
    在GridView中使用关联模型进行搜索和排序 首先我们有两个模型它们直接有关联: class Author extends CActiveRecord { ... } class Post extends CActiveRecord { ... function relations() { return array( '
  • 使用NSString 的格式化大全 dcj3sjt126com Objective-C
    格式定义The format specifiers supported by the NSString formatting methods and CFString formatting functions follow the IEEE printf specification; the specifiers are summarized in Table 1. Note that you c
  • 使用activeX插件对象object滚动有重影 蕃薯耀 activeX插件滚动有重影
      使用activeX插件对象object滚动有重影   <object style="width:0;" id="abc" classid="CLSID:D3E3970F-2927-9680-BBB4-5D0889909DF6" codebase="activex/OAX339.CAB#
  • SpringMVC4零配置 hanqunfeng springmvc4
    基于Servlet3.0规范和SpringMVC4注解式配置方式，实现零xml配置，弄了个小demo，供交流讨论。     项目说明如下： 1.db.sql是项目中用到的表，数据库使用的是oracle11g 2.该项目使用mvn进行管理，私服为自搭建nexus,项目只用到一个第三方 jar，就是oracle的驱动； 3.默认项目为零配置启动，如果需要更改启动方式，请
  • 《开源框架那点事儿16》：缓存相关代码的演变 j2eetop 开源框架
    问题引入 上次我参与某个大型项目的优化工作，由于系统要求有比较高的TPS，因此就免不了要使用缓冲。 该项目中用的缓冲比较多，有MemCache，有Redis，有的还需要提供二级缓冲，也就是说应用服务器这层也可以设置一些缓冲。 当然去看相关实现代代码的时候，大致是下面的样子。 [java] view plain copy print ? public vo
  • AngularJS浅析 kvhur JavaScript
    概念 AngularJS is a structural framework for dynamic web apps. 了解更多详情请见原文链接：http://www.gbtags.com/gb/share/5726.htm Directive 扩展html，给html添加声明语句，以便实现自己的需求。对于页面中html元素以ng为前缀的属性名称，ng是angular的命名空间
  • 架构师之jdk的bug排查(一)---------------split的点号陷阱 nannan408 split
    1.前言.    jdk1.6的lang包的split方法是有bug的,它不能有效识别A.b.c这种类型,导致截取长度始终是0.而对于其他字符,则无此问题.不知道官方有没有修复这个bug. 2.代码 String[] paths = "object.object2.prop11".split("'"); System.ou
  • 如何对10亿数据量级的mongoDB作高效的全表扫描 quentinXXZ mongodb
      本文链接:  http://quentinXXZ.iteye.com/blog/2149440 一、正常情况下，不应该有这种需求 首先，大家应该有个概念，标题中的这个问题，在大多情况下是一个伪命题，不应该被提出来。要知道，对于一般较大数据量的数据库，全表查询，这种操作一般情况下是不应该出现的，在做正常查询的时候，如果是范围查询，你至少应该要加上limit。 说一下，
  • C语言算法之水仙花数 qiufeihu c算法
    /** * 水仙花数 */ #include <stdio.h> #define N 10 int main() { int x,y,z; for(x=1;x<=N;x++) for(y=0;y<=N;y++) for(z=0;z<=N;z++) if(x*100+y*10+z == x*x*x
  • JSP指令 wyzuomumu jsp
    jsp指令的一般语法格式： <%@ 指令名 属性 =”值 ” %> 常用的三种指令： page,include,taglib page指令语法形式： <%@ page 属性 1=”值 1” 属性 2=”值 2”%> include指令语法形式： <%@include file=”relative url”%> (jsp可以通过 include
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他